import React, { Component } from 'react'
import { View, Image } from 'react-native'
import { Carousel } from '@ant-design/react-native';
import styles from './Swiper_style'
import { get } from '@/src/utils/http.js'
import { inject, observer } from 'mobx-react'

interface Props {
  store?: any
}
interface State {
  list: Array<any>
}
@inject('store')
@observer
class Swiper extends Component<Props, State> {
  state = {
    list: []
  }

  async componentDidMount() {
    // let result = await get('http://192.168.2.1:8088/swipper')
    // this.setState({
    //   list:result.data
    // })
    // let result = await get('http://192.168.2.1:8088/hotlist')
    // console.log(result)
    // this.props.store.setList(result)
  }

  render() {
    return (
      <View>
        <Carousel
          style={styles.wrapper}
          selectedIndex={2}
          autoplay
          infinite
        >
          {
            this.props.store.list.slice(0,5).map((item: any, index:number) => {
              return <Image style={styles.swiperImg} key={index} source={{ uri: item.img }} ></Image>
            })
          }



        </Carousel>

      </View>
    )
  }
}

export default Swiper;